<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>MyPane</title>
    <link rel="stylesheet" href="css/semantic.min.css">
    <link rel="stylesheet" href="css/icon.min.css">
    <link rel="stylesheet" href="css/main.css">
</head>

<body style="background-color:rgb(245, 246, 238);">
    <div class="ui aligned center aligned grid">
        <div class="column main-container left aligned" style="margin-top:20px;">
            <div id="clock"></div>
            <div id="todolist"></div>
            <div class="ui vertical segment">
                <div class="ui secondary pointing menu">
                    <a class="active item" data-tab="bookmark">收藏夹</a>
                    <a class="item" data-tab="history">历史</a>
                    <div class="right menu">
                        <div class="item">
                            <div class="ui icon input">
                                <input type="text" placeholder="搜索...">
                                <i class="search link icon"></i>
                            </div>
                        </div>
                        <a class="ui item"><i class="add icon"></i>新增</a>
                    </div>
                </div>
                <div class="ui container">
                    <div class="ui tab active" data-tab="bookmark">
                        <div class="ui labels">
                            <a class="ui image label" href="http://www.baidu.com" target="_blank">
                                <img src="http://api.byi.pw/favicon/?url=www.baidu.com">百度
                                <i class="delete icon"></i>
                            </a>
                            <a class="ui image label" href="http://www.oschina.net" target="_blank">
                                <img src="http://api.byi.pw/favicon/?url=www.oschina.net">开源中国
                                <i class="delete icon"></i>
                            </a>
                            <a class="ui image label">
                                <img src="http://api.byi.pw/favicon/?url=blog.icewingcc.com">Adrienne
                                <i class="delete icon"></i>
                            </a>
                        </div>
                    </div>
                    <div class="ui tab" data-tab="history"></div>
                </div>
            </div>
        </div>
    </div>
</body>

<!--script lib start-->
<script src="lib/jquery-2.1.4.min.js"></script>
<script src="lib/semantic.min.js"></script>
<script src="lib/react.js"></script>
<!--<script src="lib/react-with-addons.js"></script>-->
<script src="lib/JSXTransformer.js"></script>
<!--script lib end-->
<!--script app start-->
<script src="js/utils.js"></script>
<script type="text/jsx" src="js/clock.jsx"></script>
<script type="text/jsx" src="js/todolist.jsx"></script>
<script type="text/jsx" src="js/app.jsx"></script>
<!--script app end-->
<script>
    $('.menu .item').tab();
</script>

</html>
